<template>
  <div class="home-selection-find">
    <div class="home-selection-find-shop" v-for="(item, i) in good" :key="i">
      <img :src="item.pic" alt="" class="home-selection-find-shop-pic" />
      <div class="home-selection-find-shop-title">
        <span class="home-selection-find-shop-title-tag">天猫</span>
        {{ item.dtitle }}
      </div>
      <div class="home-selection-find-shop-price">
        券后 <span class="home-rmb">¥</span
        ><span class="home-selection-find-shop-new-price">{{
          item.jiage
        }}</span>
        <span class="home-selection-find-shop-lowest" v-if="item.lowest"
          >历史最低价</span
        >
      </div>
      <div class="home-selection-find-shop-quan-box">
        <div class="home-selection-find-shop-qjd" v-if="item.labelTwo">
          旗舰店
        </div>
        <div class="home-selection-find-shop-bk" v-if="item.labelOne">爆款</div>
        <div class="home-selection-find-shop-quan">
          <span class="home-selection-find-shop-quan-tag">券</span
          >{{ item.quanJine }}元
        </div>
      </div>
      <div class="home-selection-find-shop-sale">
        已售{{ (item.xiaoliang / 10000).toFixed(1) }}万
      </div>
    </div>
  </div>
</template>
<script lang="ts">
import { computed, defineComponent, onMounted } from "vue";
import { useStore } from "vuex";

export default defineComponent({
  setup() {
    const store = useStore();
    const good = computed(() => {
      return store.state.home.good;
    });
    onMounted(() => {
      store.dispatch({
        type: "home/getgood",
      });
    });
    return {
      good,
    };
  },
});
</script>
